
<template>
    <div class="PersonalMain">
       <div class="Tags">
        <div class="LeftBox">
            <div class="Tag">
     <router-link to="/MyPerson/Collect">
       
       
            <i class="el-icon-star-on"></i>
            <span>收藏</span>
      
     </router-link>
    </div>
     <div class="Tag">
          <router-link to="/MyPerson/Subscribe" >
          
            <i class="el-icon-star-on"></i>
            <span>订阅</span>

          </router-link>

        </div>
          <div class="Tag">
        <router-link to="/MyPerson/Publish">
          
            <i class="el-icon-star-on"></i>
            <span>动态</span>
    

        </router-link>
       </div>
       <div class="Tag">
        <router-link to="/MyPerson/PersonalSettings">
         
            <i class="el-icon-star-on"></i>
            <span>设置</span>
      
        </router-link>
    </div>
    </div>

        <div class="rigthBox"> 
        
            <div class="val">
            <span>关注数</span>
            <span>0</span>
        </div>
        <div class="val">
            <span>访问量</span>
            <span>0</span>
        </div>
        <div class="val">
            <span>点赞量</span>
            <span>0</span>
        </div>
        <div class="val">
            <span>订阅量</span>
            <span>0</span>
        </div>
        
        </div>
    
       </div>
        

       <div class="Contents">
         
          <router-view></router-view>

        </div>
    </div>
  </template>
  <script>
  
  export default {
    data() {
      return {
  
      };
    },
    components:{
     
    },
    methods: {
    
    }
  
  }
  </script>
  
  <style scoped>
.PersonalMain{
  display: flex;
  flex-direction: column;
}
  
 .Tags{
    height: 60px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
 }

 .LeftBox{
    display: flex;
    height: 60px;

 }
 .LeftBox .Tag{
    width: 80px;
 
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
}
.LeftBox .Tag:hover{
 background-color: antiquewhite;

}
.rigthBox{
    display: flex;
    height: 60px;
}
.rigthBox .val{
    width: 70px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
}
.Contents{
 margin-top: 10px;
 border-top: 0.5px solid #cdcccc;
 box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); 
}
  </style>